<template>
  <a-modal
    title="编辑单位"
    :width="1200"
    :visible="visible"
    @ok="handleSubmit"
    @cancel="handleCancel"
  >
    <a-form :form="form">
      <a-row :gutter="24">
        <a-col :span="8">
          <a-form-item label="单位名" required :labelCol="{ span: 8 }" :wrapperCol="{ span: 16 }" has-feedback>
            <a-input v-decorator="['organizationName', { rules: [{ required: true, message: '请输入单位名！' }] }]"></a-input>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            label="上级单位"
            :loading="treeLoading"
            required
            :labelCol="{ span: 8 }"
            :wrapperCol="{ span: 16 }"
            has-feedback
          >
            <a-tree-select
              v-decorator="['parentId', { rules: [{ required: true, message: '请选择上级单位' }] }]"
              ref="orgTree"
              :tree-data="unitTree"
              :style="{ width: '100%' }"
              :dropdown-style="{ maxHeight: 600, overflow: 'auto' }"
              placeholder="请选择上级单位"
              allow-clear
              :show-search="true"
              :tree-default-expand-all="false"
              :tree-checkable="false"
              :tree-check-strictly="true"
              :tree-node-filter-prop="title"
              :disabled="disabled"
              @change="handleOrganNameClick"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item label="排序" required :labelCol="{ span: 8 }" :wrapperCol="{ span: 16 }" has-feedback>
            <a-input v-decorator="['dataSort', { rules: [{ required: true, message: '请输入单位名！' }] }]"></a-input>
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
  </a-modal>
</template>
<script>
import { getUnitTree1, FbEditData } from '@/api/modular/system/violationManage'
import { mapGetters } from 'vuex'
export default {
  data() {
    return {
      disabled: false,
      visible: false,
      title: '',
      unitTree: [],
      treeLoading: true,
      parentName: '',
      organizationId: '',
      queryparam: {},
      parentId: '',
      fabaotree: {
        id: '00'
      },
      form: this.$form.createForm(this)
    }
  },
  created() {
    this.getUnitTree()
  },
  computed: {
    ...mapGetters(['userInfo'])
  },
  methods: {
    // 打开页面初始化
    edit(record) {
      console.log(record)
      this.visible = true
      setTimeout(() => {
        this.form.setFieldsValue({
          organizationName: record.organizationName,
          dataSort: record.dataSort,
          parentId: record.parentId
        })
        if (record.parentId !== '11') {
          this.disabled = false
        } else {
          this.disabled = true
        }
        this.parentId = record.parentId
        this.organizationId = record.organizationId
      }, 100)
    },
    handleSubmit() {
      const {
          form: { validateFields }
        } = this
        this.confirmLoading = true
      validateFields(async (errors, values) => {
        if (!errors) {
          values.parentId = this.parentId
          values.organizationId = this.organizationId
          console.log(values)
          FbEditData(values).then(res => {
            console.log('res:', res)
            if (res.success && res.code === 200) {
              this.$message.success('修改发包单位成功!')
              this.getUnitTree()
              this.handleCancel()
              this.$emit('ok')
            } else {
              this.$message.error('编辑失败：' + res.message)
              this.handleCancel()
            }
          })
        } else {
          this.$message.warning('信息尚未完善，请完善后再提交')
        }
      })
    },
    handleCancel() {
      this.visible = false
    },
    getUnitTree() {
      getUnitTree1(Object.assign(this.fabaotree)).then(res => {
        this.treeLoading = false
        this.unitTree = res.data
      })
    },
    handleOrganNameClick(value, label, e) {
      console.log(value)
      this.parentId = value
    }
  }
}
</script>
